<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div>
      <img src="./01.png" />
    </div>
    <script>
      class Person {
        name = "孙悟空";
        age = 18;
        sayHello() {
          console.log("hello! 我是", this.name);
        }
      }
      const p1 = new Person();
      const p2 = new Person();

      console.log(p1.__proto__ === p2.__proto__); // true
      /*
      所有同类对象，它们的原型对象都是同一个

      js中的继承，就是通过原型链来实现的

        1. 继承时，子类的原型是父类

        2. 继承时，所有的属性和方法，包括静态属性，都会继承到子类当中！！

        3. 私有属性不会继承到子类当中，即使在控制台打印显示子类实例中存在父类的私有字段，也并不能直接在子类当中访问
    */

      class Father {
        first_name = "姚";
        height = 175;
        static last_name = "本军";
        #age = 18;
      }

      class Son extends Father {}
      const father = new Father();
      const son = new Son();
      console.log("father---", father);
      console.log("son---", son);

      // 子类的原型对象就是父类
      console.log("Son.__proto__ === Father", Son.__proto__ === Father); // true

      /*
    实例的原型链是通过类的   prototype   属性来实现的，而不是直接指向父类。
  */

      console.log("son.__proto__ === father", son.__proto__ === father); // false
      console.log("son.__proto__ === Father", son.__proto__ === Father); // false

      // son.__proto__  === Son.prototype
      console.log(
        "son.__proto__  === Son.prototype",
        son.__proto__ === Son.prototype
      ); // true

      /*
        综上可得：
        1.子类的原型对象就是父类 Son.prototype === Father
        2.实例的原型链是通过类的   prototype   属性来实现的，而不是直接指向父类。

      */
      console.log(Son.prototype.__proto__ === Father.prototype); // true
      // 相当于
      console.log(father.__proto__ === Father.prototype); // true

      // 注意区别，以上俩个条件并不能判断下面的等式
      console.log(Son.prototype === father); // false

      /*

[son] (Son 的实例)
   ↓ __proto__
[Son.prototype] (Son 的原型)
   ↓ __proto__
[Father.prototype] (Father 的原型)
   ↓ constructor
[Father] (Father 构造函数)

[father] (Father 的实例)
   ↓ __proto__
[Father.prototype] (Father 的原型)
   ↓ constructor
[Father] (Father 构造函数)


*/
    </script>
  </body>
</html>
